<template>
<div class="container-list">
  <div class="list__con">
   <el-table
    :data="tableData"
    stripe
    border
    fit
    height="100%"
    :highlight-current-row="true">
    <el-table-column width="50" label="序号">
    <template slot-scope="scope">
      {{(pageInfo.currentpage-1)*pageInfo.limit+scope.$index+1}}
    </template>
    </el-table-column>
    <el-table-column
      prop="YDH"
      label="运单号"
      min-width="150">
    </el-table-column>
    <el-table-column
      prop="JJLXR"
      label="寄件人姓名"
      min-width="120">
    </el-table-column>
    <el-table-column
      prop="JJSJH"
      label="寄件人手机"
      min-width="120">
    </el-table-column>
    <el-table-column
      prop="JJDZ"
      label="寄件地址"
      min-width="120">
    </el-table-column>
    <el-table-column
      prop="SJLXR"
      label="收件人姓名"
      min-width="120">
    </el-table-column>
    <el-table-column
      prop="SJSJH"
      label="收件人手机"
      min-width="120">
    </el-table-column>
    <el-table-column
      prop="SJDZ"
      label="收件地址"
      min-width="120">
    </el-table-column>
    <el-table-column
      prop="JJSJ"
      label="寄件时间"
      min-width="200">
    </el-table-column>
  </el-table>
  </div>
  <div class="pager__con">
    <xdh-pager  class="pager" :total="pageInfo.total" 
        :size="pageInfo.limit"
        :page="pageInfo.currentpage"
         @current-change="pageChange"></xdh-pager>
  </div>
</div>
</template>
<script>
import XdhPager from '@/widgets/xdh-pager'
import {mapState} from 'vuex'
import mSearch from '@/base/mixin/m-search'
export default {
    mixins: [mSearch],
    components: {
      XdhPager
    },
    computed: {
      ...mapState(['mySearchResult_mode', 'mySearchResult_query'])
    },
    watch: {
      mySearchResult_query: {
        immediate: true,
        deep: true,
        handler(val) {
          if(this.mySearchResult_mode === 'list') {
            this.fetchList();
          }
        }
      }
    },
    data () {
      return {
         pageInfo: {
          limit: 10,
          total: 1000,
          currentpage: 1,
          pagecount: 5
        },
         tableData: []
      }
    },
    methods: {
      fetchList() {
        this.getSearchResultList(this.mySearchResult_query).then(res => {
          console.log(res)
          this.tableData = res.list;
        })
      }
    }
  }
</script>